import { defineStore } from 'pinia'
import { ref } from 'vue'

export const usePageDialogStore = defineStore('pageDialog', () => {
  // 每个页面的弹窗状态
  const dialogs = ref({
    clientHub: {
      visible: false,
      data: null
    },
    equipMng: {
      visible: false,
      data: null
    }
  })

  // 打开指定页面的弹窗
  const openDialog = (page, data) => {
    if (dialogs.value[page]) {
      dialogs.value[page].visible = true
      dialogs.value[page].data = data
    }
  }

  // 关闭指定页面的弹窗
  const closeDialog = (page) => {
    if (dialogs.value[page]) {
      dialogs.value[page].visible = false
      dialogs.value[page].data = null
    }
  }

  // 关闭所有弹窗
  const closeAllDialogs = () => {
    Object.keys(dialogs.value).forEach(page => {
      dialogs.value[page].visible = false
      dialogs.value[page].data = null
    })
  }

  // 只显示指定页面的弹窗，隐藏其他页面的弹窗
  const showOnlyDialog = (page, data) => {
    // 先隐藏所有弹窗
    Object.keys(dialogs.value).forEach(key => {
      if (key !== page) {
        dialogs.value[key].visible = false
      }
    })
    // 再显示指定页面的弹窗
    if (dialogs.value[page]) {
      dialogs.value[page].visible = true
      dialogs.value[page].data = data
    }
  }

  return {
    dialogs,
    openDialog,
    closeDialog,
    closeAllDialogs,
    showOnlyDialog
  }
})
